<template>
	<view class="page-content">
		<u-loading-page :loading="loading" bg-color="#e8e8e8"></u-loading-page>
		<u--form labelWidth='auto' labelAlign="left" labelPosition="left" :model="detailform" :rules="rules"
			ref="form1">
			<u-form-item label="审批结果" prop="approveResult" borderBottom ref="item1">
				<u--input customStyle="font-weight: bold;margin: 5px;" inputAlign='center' shape='square' border="none"
					v-model="detailform.approveResult"></u--input>
			</u-form-item>
			<u-form-item label="审批时间" prop="approveTime" borderBottom ref="item1">
				<u--input customStyle="font-weight: bold;margin: 5px;" inputAlign='center' shape='square' border="none"
					v-model="detailform.approveTime"></u--input>
			</u-form-item>
			<u-form-item label="审批人" prop="approveName" borderBottom ref="item1">
				<u--input customStyle="font-weight: bold;margin: 5px;" inputAlign='center' shape='square' border="none"
					v-model="detailform.approveName"></u--input>
			</u-form-item>
			<u-form-item label="审批意见" prop="approveDetail" borderBottom ref="item1">
				<u--input customStyle="font-weight: bold;margin: 5px;" inputAlign='center' shape='square' border="none"
					v-model="detailform.approveDetail"></u--input>
			</u-form-item>
			<u-form-item label="是否签订协议" prop="isAgreement" borderBottom @click="showSex = true" ref="item1">
				<u--input v-model="detailform.isAgreement" inputAlign='center' disabled disabledColor="#ffffff"
					placeholder="请选择是或否" border="none">
				</u--input>
				<u-icon slot="right" name="arrow-right"></u-icon>
			</u-form-item>
			<!-- <u-form-item label="性别" prop="sex" borderBottom @click="showSex = true; hideKeyboard()" ref="item1">
				<u--input v-model="detailform.sex" inputAlign='center' disabled disabledColor="#ffffff"
					placeholder="请选择性别" border="none">
				</u--input>
				<u-icon slot="right" name="arrow-right"></u-icon>
			</u-form-item> -->
			<u-form-item label="协议号" prop="protocolno" borderBottom ref="item1">
				<u--input customStyle="font-weight: bold;margin: 5px;" inputAlign='center' shape='square' border="none"
					v-model="detailform.protocolno"></u--input>
			</u-form-item>
			<u-form-item label="签订协议说明" prop="agreementDetail" borderBottom ref="item1">
				<u--input customStyle="font-weight: bold;margin: 5px;" inputAlign='center' shape='square' border="none"
					v-model="detailform.agreementDetail"></u--input>
			</u-form-item>		
			<u-form-item label="备注" prop="remark" borderBottom ref="item1">
				<u--input customStyle="font-weight: bold;margin: 5px;" inputAlign='center' shape='square' border="none"
					v-model="detailform.remark"></u--input>
			</u-form-item>	
		</u--form>
		<u-row customStyle="margin:10px">
			<u-col span="12">
				<u-button class="custom-style" type="primary" size="small" @click="handel_submit_click">提交
				</u-button>
			</u-col>
		</u-row>
		<u-action-sheet :show="showSex" :actions="actions" title="请选择是或否" @close="showSex = false" @select="sexSelect">
		</u-action-sheet>
	</view>
</template>

<script>
	import {
		transformPostBody,
		transformRequestURL
	} from "@/utils/requestParams.js";
	import {
		QueryGzAuditList,
		addGzAudit,
		updateGzAudit,
		getGzAudit,
		delGzAudit,
		QueryGzAuditHistory
	} from "@/api/elder/GzAudit.js";

	export default {
		data() {
			return {
				detailform: { //需要验证的属性必须设置，不能为空
					//name: '', //老人姓名
					//sex: '', //性别
					//idNumber: '', //身份证号码
					isAgreement: '',//是否签订协议
				},
				loading: false, //加载中
				id: null,
				showSex: false,
				actions: [{
						name: '是',
					},
					{
						name: '否',
					},
				],
				rules: {
					name: [{
						type: 'string',
						required: true,
						message: '请填写姓名',
						trigger: ['blur', 'change']
					}],
					idNumber: [{
						type: 'string',
						required: true,
						message: '请填写身份证号',
						trigger: ['blur', 'change']
					}],
					/* sex: [{
						type: 'string',
						max: 1,
						required: true,
						message: '请选择男或女',
						trigger: ['blur', 'change']
					}], */
					isAgreement: [{
						type: 'string',
						max: 1,
						required: true,
						message: ' ',
						trigger: ['blur', 'change']
					}],
				},
			}
		},
		onLoad: function(options) {
			console.log('options', options.id)
			this.id = options.id
		},
		onShow() {
			this.getList();
		},
		onReady() {
			//如果需要兼容微信小程序，并且校验规则中含有方法等，只能通过setRules方法设置规则。
			this.$refs.form1.setRules(this.rules)
		},
		methods: {
			//日期数据回调
			timeConfirm(e){
				console.log(e);
				this.detailform.approveTime = e.year + '-' + e.month + '-' + e.day;
			},
			//获取详细信息
			getList() {
				this.loading = true;
				getGzAudit(this.id).then((response) => {
					this.loading = false;
					console.log("getGzAudit", response);
					this.detailform = Object.assign({}, this.detailform, response.data)
				});
			},
			sexSelect(item) {
				this.detailform.isAgreement = item.name
			},
			//提交
			handel_submit_click() {
				this.$refs.form1.validate().then(res => {
					uni.$u.toast('提交成功')
					//提交修改
					this.loading = true;
					console.log(this.detailform);
					updateGzAudit(this.detailform).then((response) => {
						console.log("updateGzAudit", response);
						this.loading = false;
						this.getList();
						this.$tab.navigateBack();
					});
				}).catch(errors => {
					console.log("updateGzAudit errors:", errors);
					uni.$u.toast('校验失败,请修改后再尝试提交')
				})
			}
		},
		
	}
</script>

<style lang="scss">
	page {
		background-color: white;
		display: flex;
		justify-content: center;
	}

	.page-content {
		width: 93%;
	}

	.custom-style {
		width: 80%;
		font-weight: bolder;
		font-size: 17px;
	}
</style>
